import React from 'react'
import "./index.css"

export default function Footer({todoList,setTodoList}) {
  const getCheckedNum = ()=>{
    return todoList.reduce((p,c) => c.done?(p+1):p,0)
  }
  return (
    <div className="todo-footer">
        <label>
          <input type="checkbox"/>
        </label>
        <span>
          <span>已完成{getCheckedNum()}</span> / 全部{todoList.length}
        </span>
        <button className="btn btn-danger">清除已完成任务</button>
      </div>
  )
}
